﻿<UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:WpfHero="clr-namespace:WpfHero;assembly=WHEngine"
	x:Class="WpfHeroTutorial.HorizontalScroller"
	x:Name="UserControl"
	Width="491" Height="344" xmlns:WpfHeroTutorial="clr-namespace:WpfHeroTutorial">
	<UserControl.Resources>
		<WpfHeroTutorial:GemPauseConverter x:Key="GemPauseConverter"/>
		<WpfHeroTutorial:GemSizeConverter x:Key="GemSizeConverter"/>
		<ItemsPanelTemplate x:Key="GemLinePanelTemplate">
			<StackPanel IsItemsHost="True" Orientation="Horizontal"/>
		</ItemsPanelTemplate>
		<DataTemplate x:Key="GemTemplate">
			<WpfHeroTutorial:GemControl x:Name="gemControl" Width="{Binding Converter={StaticResource GemSizeConverter}, Mode=OneWay}" Status="{Binding Path=Status, Mode=Default}" Margin="{Binding Converter={StaticResource GemPauseConverter}, Mode=OneWay}"/>
			<DataTemplate.Triggers>
				<Trigger Property="Status" SourceName="gemControl" Value="Missed">
					<Setter Property="Opacity" TargetName="gemControl" Value="0.5"/>
				</Trigger>
				<Trigger Property="Status" SourceName="gemControl" Value="Hit">
					<Setter Property="BitmapEffect" TargetName="gemControl">
						<Setter.Value>
							<OuterGlowBitmapEffect/>
						</Setter.Value>
					</Setter>
				</Trigger>
			</DataTemplate.Triggers>
		</DataTemplate>
	</UserControl.Resources>

	<UserControl.DataContext>
		<WpfHero:WHEngine>
			<WpfHero:WHEngine.Gemline3Gems>
				<WpfHero:GemModel EndAt="00:00:05" StartAt="00:00:04"/>
			</WpfHero:WHEngine.Gemline3Gems>
			<WpfHero:WHEngine.Gemline1Gems>
				<WpfHero:GemModel EndAt="00:00:01" StartAt="00:00:00.5000000"/>
				<WpfHero:GemModel EndAt="00:00:02.1000000" StartAt="00:00:02"/>
			</WpfHero:WHEngine.Gemline1Gems>
		</WpfHero:WHEngine>
	</UserControl.DataContext>

	<Grid x:Name="LayoutRoot">
		<ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" Height="335" VerticalAlignment="Top" Width="484" HorizontalAlignment="Left">
			<Grid x:Name="grid">
				<StackPanel Margin="{Binding Path=Margin, ElementName=path, Mode=Default}" x:Name="stackPanel">
					<ItemsControl Background="#FF843131" Height="48" ItemsSource="{Binding Path=Gemline1Gems, Mode=Default}" ItemsPanel="{DynamicResource GemLinePanelTemplate}" ItemTemplate="{DynamicResource GemTemplate}"/>
					<ItemsControl Background="#FF2E491D" Height="48" ItemsSource="{Binding Path=Gemline2Gems, Mode=Default}" ItemsPanel="{DynamicResource GemLinePanelTemplate}" ItemTemplate="{DynamicResource GemTemplate}"/>
					<ItemsControl Background="#FF17234B" Height="48" ItemsSource="{Binding Path=Gemline3Gems, Mode=Default}" ItemsPanel="{DynamicResource GemLinePanelTemplate}" ItemTemplate="{DynamicResource GemTemplate}"/>
					<ItemsControl Background="#FF625D1E" Height="48" ItemsSource="{Binding Path=Gemline4Gems, Mode=Default}" ItemsPanel="{DynamicResource GemLinePanelTemplate}" ItemTemplate="{DynamicResource GemTemplate}"/>
					<ItemsControl Background="#FF000000" Height="48" ItemsSource="{Binding Path=Gemline5Gems, Mode=Default}" ItemsPanel="{DynamicResource GemLinePanelTemplate}" ItemTemplate="{DynamicResource GemTemplate}"/>
				</StackPanel>
				<Path HorizontalAlignment="Left" Margin="50,0,0,75.9" Width="Auto" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FFFF0000" StrokeEndLineCap="Round" StrokeStartLineCap="Round" StrokeThickness="5" Data="M121,37 L121,273.05296" x:Name="path"/>
			</Grid>
		</ScrollViewer>
	</Grid>
</UserControl>